<template>
    <el-dialog
            :title="title"
            :visible.sync="isVisible"
            :width="width"
            :before-close="handleClose"
            :lock-scroll="true"
            :close-on-click-modal="false"
            custom-class="pub_dialog"
            @open="getData"
    >
        <VForm
                ref="vformComponents"
                :form="formData.form"
                :options="formData.options"
                :rules="formData.rules"
                :labelWidth="formData.labelWidth"
                :rowspan="rowspan"
                @changeAddress="changeAddress"
                @changeGdArea="changeGdArea"
                @toLoadMethods="toLoadMethods"
        ></VForm>

        <span slot="footer" class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="sure">确 定</el-button>
    </span>
    </el-dialog>
</template>

<script>
    import { collectBuildingProjectDetail,
            collectBuildingProjectUpdate,
            collectBuildingProjectAdd } from '@/api/alarm/project'
    import VForm from "@/components/VForm/index";
    export default {
        components: {
            VForm,
        },
        props: {
            width: {
                type: String,
                default: "70%",
            },
            title: {
                type: String,
                default: "详情",
            },
            id:{},
            openType:{
                type:String,
                default:"add"
            },
            dialogVisible: {
                type: Boolean,
                default: false
            }
        },
        watch: {
            'width': {
                handler(newVal, oldVal) {
                    console.log('newVal===',newVal, oldVal)
                    let w = this.width.split('%')[0]
                    if(w>=60){
                        this.rowspan = 2
                    }else{
                        this.rowspan = 1
                    }
                },
                deep: true,
                immediate: true
            },

            'projectStatusOptions':{
                handler(newVal, oldVal) {
                    this.formData.options.forEach(t=>{
                        if(t.key=='projectStatus'){
                        t.option.data = newVal
                    }
                })
                },
                deep: true,
                immediate: true
            },
        },
        computed: {
            isVisible: {
                get() {
                    return this.dialogVisible
                },
                set() {
                    this.close()
                }
            }
        },
        data() {
            return {
                rowspan:1,
                dict:{},
                formData: {
                    form: {
                            projectName:"",
                            projectAbbr:"",
                            supervisionNumber:"",
                            ythPrjcode:"",
                            provinceProjectNumber:"",
                            projectType:"",
                            litterNum:"",
                            projectLevel:"",
                            prjSizedes:"",
                            projectPropertyName:"",
                            projectFunction:"",
                            planStartTime:"",
                            planEndTime:"",
                            delegationType:"",
                            sourceInvestment:"",
                            buildingFunction:"",
                            projectSpace:"",
                            projectLength:"",
                            countyName:"",
                            projectAddress:"",
                            projectStatus:"",
                            imageProgress:"",
                            constructionStage:"",
                            projectLongitude:"",
                            projectLatitude:"",
                            mapData:null,
                        },
                    options: [
                                   {
                                       title: "项目名称",
                                       key: "projectName",
                                       type: "text",
                                   },
                                    {
                                      title: "项目简介",
                                      key: "projectAbbr",
                                      type: "text",
                                    },

                                   {
                                       title: "监督编号",
                                       key: "supervisionNumber",
                                       type: "text",
                                   },
                                   {
                                       title: "监管平台编号",
                                       key: "ythPrjcode",
                                       type: "text",
                                   },
                                   {
                                       title: "升级项目编号",
                                       key: "provinceProjectNumber",
                                       type: "text",
                                   },
                                // {
                                //     title: "项目分类",
                                //     key: "projectType",
                                //     type: "text",
                                // },
                                   {
                                       title: "立项文号",
                                       key: "litterNum",
                                       type: "text",
                                   },
                                   {
                                       title: "立项级别",
                                       key: "projectLevel",
                                       type: "text",
                                   },
                                   {
                                       title: "建设规模",
                                       key: "prjSizedes",
                                       type: "text",
                                   },
                                   {
                                       title: "建设性质",
                                       key: "projectPropertyName",
                                       type: "text",
                                   },
                                   {
                                       title: "工程用途",
                                       key: "projectFunction",
                                       type: "text",
                                   },
                                   {
                                       title: "计划开工日期",
                                       key: "planStartTime",
                                       type: "date",
                                   },
                                   {
                                       title: "计划竣工日期",
                                       key: "planEndTime",
                                       type: "date",
                                   },
                                // {
                                //     title: "委托类型",
                                //     key: "delegationType",
                                //     type: "text",
                                //
                                // },
                                   {
                                       title: "投资来源",
                                       key: "sourceInvestment",
                                       type: "text",
                                   },
                                   {
                                       title: "建筑功能",
                                       key: "buildingFunction",
                                       type: "text",
                                   },
                                   {
                                       title: "建筑面积(平方米)",
                                       key: "projectSpace",
                                       type: "text",
                                   },
                                   {
                                       title: "项目长度(千米)",
                                       key: "projectLength",
                                       type: "text",
                                   },
                                   {
                                       title: "项目所在地",
                                       key: "countyName",
                                       type: "text",
                                   },

                                    {
                                        title: "项目状态",
                                        key: "projectStatus",
                                        type: "select",
                                        option: {
                                            data: this.projectStatusOptions,
                                            props: {
                                                key: "id", // 指定key对应data的字段
                                                label: "label", // 指定label对应data的字段
                                                value: "value", // 指定value对应data的字段
                                            },
                                        },
                                    },
                                   {
                                       title: "形象进度",
                                       key: "imageProgress",
                                       type: "text",
                                   },
                                   {
                                       title: "施工阶段",
                                       key: "constructionStage",
                                       type: "text",
                                   },

                                  {
                                    title: "项目地址",
                                    type:'mapPosition',
                                    key:'mapData',
                                  },
                    ],
                    rules: {
                        projectName :[
                          {max:100, message: '长度最大为100个字符', trigger: 'blur'}
                        ],
                        projectAbbr :[
                          {max:1000, message: '长度最大为1000个字符', trigger: 'blur'}
                        ],
                        supervisionNumber :[
                          {max:30, message: '长度最大为30个字符', trigger: 'blur'}
                        ],
                        ythPrjcode :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        provinceProjectNumber :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        projectType :[
                        ],
                        litterNum :[
                          {max:30, message: '长度最大为30个字符', trigger: 'blur'}
                        ],
                        projectLevel :[
                          {max:30, message: '长度最大为30个字符', trigger: 'blur'}
                        ],
                        prjSizedes :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        projectPropertyName :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        projectFunction :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        planStartTime :[
                        ],
                        planEndTime :[
                        ],
                        delegationType :[
                        ],
                        sourceInvestment :[
                          {max:100, message: '长度最大为100个字符', trigger: 'blur'}
                        ],
                        buildingFunction :[
                          {max:100, message: '长度最大为100个字符', trigger: 'blur'}
                        ],
                        projectSpace :[
                        ],
                        projectLength :[
                        ],
                        countyName :[
                          {max:100, message: '长度最大为100个字符', trigger: 'blur'}
                        ],
                        projectAddress :[
                          {max:200, message: '长度最大为200个字符', trigger: 'blur'}
                        ],
                        projectStatus :[
                        ],
                        imageProgress :[
                          {max:200, message: '长度最大为200个字符', trigger: 'blur'}
                        ],
                        constructionStage :[
                          {max:200, message: '长度最大为200个字符', trigger: 'blur'}
                        ],
                        projectLongitude :[
                        ],
                        projectLatitude :[
                        ],
                    },
                    labelWidth: "140px",
                },
            // 字典

                projectStatusOptions:[],
            };
        },
        methods: {
            toLoadMethods(methods){
              this[methods]();
            },
            submitFormat(){
            },
            loadFormat(){
            },
            getCheckBoxData(value,option,type){
                if(type=="submit"){
                    if(value.length==0){
                        return null
                    }
                    let temp = [];
                    value.forEach(t=>{
                        let item = option.find(x=> x.label == t)
                    if(item!=undefined){
                        temp.push(item.value)
                    }
                })
                    return temp.join(",")
                }else {
                    if(!value){
                        return []
                    }else {
                        let data = value.split(",")
                        let temp = []
                        data.forEach(t=>{
                            let item = option.find(x=> x.value == t)
                        if(item!=undefined){
                            temp.push(item.label)
                        }
                    })
                        return temp
                    }
                }
            },
            sure(){
                console.log('sure===',this.formData.form)
                this.$refs.vformComponents.$refs.form.validate().then(res=>{
                    this.submitFormat()
                    this.positionSubmitFormat()
                    if(this.openType == "add"){
                        this.add()
                    }else{
                        this.update()
                    }
                })
            },
            add(){
                this.formData.form.id = null
                collectBuildingProjectAdd(this.formData.form).then(res=>{
                    if(res.code==200){
                    this.$message({
                        message: this.$t('tips.createSuccess'),
                        type: 'success'
                    })
                    this.closeSuccess()
                    }else{
                    this.$message({
                        message: this.$t('tips.systemException'),
                        type: 'error'
                    })
                    }
                })
            },
            update(){
                   collectBuildingProjectUpdate(this.formData.form).then(res=>{
                        if(res.code==200){
                        this.$message({
                             message: this.$t('tips.updateSuccess'),
                            type: 'success'
                        })
                        this.closeSuccess()
                      }else{
                        this.$message({
                            message: this.$t('tips.systemException'),
                            type: 'error'
                        })
                     }
                })
            },
            cancel(){
                this.close()
            },
            handleClose(done) {
                done()
                this.close()
            },
            closeSuccess(){

                this.$refs.vformComponents.$refs.form.resetFields();
                this.$emit('success')

            },
            close(){
                this.$refs.vformComponents.$refs.form.resetFields();
                this.$emit('close')

            },
            getData(){

              this.projectStatusOptions = []
              this.$commonJs.filterDataDict("buildingProjectStatus",this.projectStatusOptions )

                if(this.openType!="add"){
                    collectBuildingProjectDetail(this.id).then(res=>{
                        if(res.code==200){
                            this.formData.form = res.data
                            this.loadFormat()
                            this.positionLoadFormat()
                         }else{
                            this.$message({
                                message: this.$t('tips.systemException'),
                                type: 'error'
                            })
                        }
                    })
                }
            },

            getCountySubIndex(cityCode){
              // 中山、东莞截取10位
              let filterList = ['442000000000','441900000000']
              if(filterList.findIndex(t=>t==cityCode)>-1){
                return 10;
              }
              return 6;
            },

            positionSubmitFormat(){

              let mapData = this.formData.form.mapData
              console.log(">>>");
              console.log(mapData);
              if(mapData){
                this.formData.form.projectLongitude = mapData.gpsX
                this.formData.form.projectLatitude = mapData.gpsY
                this.formData.form.projectAddress = mapData.address
                this.formData.form.areaCode = mapData.towncode
                if(mapData.towncode){
                  this.formData.form.provinceCode = mapData.towncode.substr(0,2).padEnd(12,'0')
                  this.formData.form.cityCode = mapData.towncode.substr(0,4).padEnd(12,'0')
                  let subIndex = this.getCountySubIndex(this.formData.form.cityCode)
                  this.formData.form.countyCode = mapData.towncode.substr(0,subIndex).padEnd(12,'0')
                }
              }
            },
            positionLoadFormat(){
              let form = this.formData.form
              let mapData = {}


              mapData.address = form.projectAddress
              mapData.gpsX = parseFloat(form.projectLongitude)
              mapData.gpsY = parseFloat(form.projectLatitude)
              mapData.towncode = form.areaCode
              this.formData.form.mapData = mapData




              console.log("mpap",mapData)
            },

            changeAddress(data){
              // console.log(data)
              this.formData.form.mapData = data
              this.formData.form.areaCode = data.areaCode
            },
            changeGdArea(data){
              console.log(data)
            },
        },
    };
</script>

<style lang="scss" scoped>

</style>
